<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <#assign base=request.contextPath />
    <title>首页</title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link href="${base}/css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="${base}/css/style.css"/>
    <link rel="stylesheet" href="${base}/frame/layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="${base}/fonts/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="${base}/admin/iconfont.css"/>
    <script src="${base}/js/mui.js"></script>
    <script src="${base}/fonts/iconfont.js"></script>
    <script src="${base}/frame/layui/layui.js"></script>
    <script src="${base}/js/jquery.js"></script>
    <script src="${base}/wangEdit/wangEditor.js"></script>
    <style>
        body {
            font-family: 'Helvetica Neue', Helvetica, sans-serif;
            font-size: 13px;
            line-height: 19px;
            color: #000;
            max-width: 560px;
            margin: 0 auto;
            background-color: white;
            -webkit-overflow-scrolling: touch;
        }

        .mui-table-view .mui-media-object {
            line-height: 60px;
            max-width: 96px;
            width: 96px;
            height: 60px;
        }

        .demo div {
            display: inline-block;
            float: none;
            text-align: center;
            padding: 5px;
        }

        #small {
            width: 100%;
        }

        #text1 {
            width: 100%;
            height: auto;
            font-size: 12px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .mui-table-view-cell > a:not(.mui-btn) {
            white-space: inherit;
        }

        .h5margin {
            line-height: 1;
            margin-top: 3px;
            font-size: 15px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .layui-flow-more {
            padding-bottom: 20px;
        }
    </style>
</head>
<body>
<nav class="mui-bar mui-bar-tab">
    <a class="mui-tab-item mui-active">
        <div>
            <svg class="iconTab iconTab2" aria-hidden="true">
                <use xlink:href="#icon-shouye1"></use>
            </svg>
        </div>
        <span class="mui-tab-label">首页</span>
    </a>

    <a class="mui-tab-item" id="make">
        <div>
            <svg class="iconTab" aria-hidden="true">
                <use xlink:href="#icon-wenda11"></use>
            </svg>
        </div>
        <span class="mui-tab-label">预约</span>
    </a>
    <a class="mui-tab-item" id="repair">
        <div>
            <svg class="iconTab" aria-hidden="true">
                <use xlink:href="##icon-zixun"></use>
            </svg>
        </div>
        <span class="mui-tab-label">报修</span>
    </a>
    <a class="mui-tab-item" id="personal">
        <div>
            <svg class="iconTab" aria-hidden="true">
                <use xlink:href="#icon-wode-copy"></use>
            </svg>
        </div>
        <span class="mui-tab-label">解绑</span>
    </a>
</nav>
<div class="mui-content">

    <div class="mui-content-padded" style="margin: 5px;">
        <div class="mui-input-row">
            <input type="search" id="keyword" class="mui-input-clear" placeholder="热门搜索">
        </div>
    </div>
<#--    <ul class="mui-table-view mui-table-view-chevron">-->
<#--        <li class="mui-table-view-cell mui-media">-->
<#--            <a class="mui-navigate-right" href="${base}/app/user/Classification">-->
<#--                <img class="mui-pull-left" src="${base}/images/top1.png"-->
<#--                     style="border-radius: 50%;height: 34px;margin-right: 10px">-->
<#--                <div class="mui-media-body">-->
<#--                    找大师-->
<#--                    <p class='mui-ellipsis'>一对一私密咨询 品质铸就</p>-->
<#--                </div>-->
<#--            </a>-->
<#--        </li>-->
<#--    </ul>-->
    <div class="demo">
        <div id="small">
            <#--<#list list as list>-->
            <#--<div class="mui-col-xs-3 mui-col-sm-3">-->
            <#--<i class="iconfont icon-hunlianganqing"></i>-->
            <#--<h5>${list.name}</h5>-->
            <#--</div>-->
            <#--</#list>-->
        </div>
    </div>
    <div class="demo" id="dsb" style="background-color: rgba(128, 208, 114, 0.1);">
        <div class="mui-col-xs-12 mui-col-sm-12">
            <h4><span class="iconfont icon-yinyang-taiji"></span> 大师榜</h4>
        </div>
    </div>
    <div id="master" class="demo">

    </div>
    <div class="demo" id="dsb" style="background-color: rgba(128, 208, 114, 0.1);">
        <div class="mui-col-xs-12 mui-col-sm-12">
            <h4><span class="iconfont icon-yinyang-taiji"></span> 新闻</h4>
        </div>
    </div>
    <div class="xinwen">
        <ul class="mui-table-view" id="masterListDiv">
            <li class="mui-table-view-cell">
                <a style="height: 20%;" href="${base}/app/user/details.html?id= ' + id + '">
                    <img class="mui-media-object mui-pull-left" src=" ${base}/images/b2.png">
                    <div class="mui-media-body">
                        <h5 class="h5margin">码云牛逼吗???</h5>
                        <p id="text1">支付宝都是马云的,你说马云牛逼不牛逼.....</p>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell">
                <a style="height: 20%;" href="${base}/app/user/details.html?id= ' + id + '">
                    <img class="mui-media-object mui-pull-left" src=" ${base}/images/b2.png">
                    <div class="mui-media-body">
                        <h5 class="h5margin">码云牛逼吗???</h5>
                        <p id="text1">支付宝都是马云的,你说马云牛逼不牛逼.....</p>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell">
                <a style="height: 20%;" href="${base}/app/user/details.html?id= ' + id + '">
                    <img class="mui-media-object mui-pull-left" src=" ${base}/images/b2.png">
                    <div class="mui-media-body">
                        <h5 class="h5margin">码云牛逼吗???</h5>
                        <p id="text1">支付宝都是马云的,你说马云牛逼不牛逼.....</p>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell">
                <a style="height: 20%;" href="${base}/app/user/details.html?id= ' + id + '">
                    <img class="mui-media-object mui-pull-left" src=" ${base}/images/b2.png">
                    <div class="mui-media-body">
                        <h5 class="h5margin">码云牛逼吗???</h5>
                        <p id="text1">支付宝都是马云的,你说马云牛逼不牛逼.....</p>
                    </div>
                </a>
            </li>
        </ul>
    </div>

</div>
<script type="text/javascript">
    <#--mui.init({-->
        <#--preloadPages: [{-->
            <#--url: '${base}/app/user/QuestionAnswer',-->
            <#--id: 'main',-->
            <#--styles: {},-->
            <#--extras: {}-->
        <#--}]-->
    <#--});-->
    document.getElementById('repair').addEventListener('tap', function () {
        mui.openWindow({
            url: '${base}/wx/user/repair',
            id: 'main'
        });

    });
    document.getElementById('make').addEventListener('tap', function () {
        mui.openWindow({
            url: '${base}/wx/user/make',
            id: 'main'
        });

    });
    document.getElementById('personal').addEventListener('tap', function () {
        mui.openWindow({
            url: '${base}/wx/user/personal',
            id: 'main'
        });

    });

</script>

</body>
</html>